//获取文章参数
let data = {
    pagenum: 1, //分页页码-默认第一页开始
    pagesize: 2, //每页显示几条数据
}



let form = layui.form;
let laypage = layui.laypage;
//获取列表数据
function renderArticle() {
    $.ajax({
        type: 'GET',
        url: '/my/article/list',
        data: data,
        success: function(res) {
            // console.log(res);
            let arr = [];
            res.data.forEach(item => {
                arr.push(`
                <tr>
                <td>${item.title}</td>
                <td>${item.cate_name}</td>
                <td>${item.pub_date}</td>
                <td>${item.state}</td>
                <td>
                    <a href="./edit-book.html?id=${item.id}"  type="button" class="layui-btn layui-btn-xs">编辑</a>
                    <button data-id="${item.id}" type="button" class="layui-btn layui-btn-xs layui-btn-danger">删除</button>
                </td>
            </tr>`);

            });
            $('tbody').html(arr.join(''));
            //
            laypage.render({
                elem: 'page', //注意，这里的 test1 是 ID，不用加 # 号
                limit: data.pagesize, //每页显示几条数据
                count: res.total, //数据总数，从服务端得到
                curr: data.pagenum,
                layout: ['count', 'limit', 'prev', 'next', 'skip'], //自定义排版
                //分页回调--切换分页时触发-页面刷新也会触发
                jump: function(obj, first) {
                    //obj包含了当前分页的所有参数，比如：
                    // console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
                    // console.log(obj.limit); //得到每页显示的条数

                    //首次不执行-阻止第一次触发
                    if (!first) {
                        data.pagenum = obj.curr; //当前页面等于curr当前页
                        data.pagesize = obj.limit;
                        renderArticle();
                    }
                }
            });

        }

    })
}
renderArticle();

//获取所有分类 渲染
$.ajax({
    type: 'GET',
    url: '/my/category/list',
    success: function(res) {
        // console.log(res);
        let arr = [];
        res.data.forEach(item => {
            arr.push(`
            <option value="${item.id}">${item.name}</option>`)

        });
        $('select[name=category]').append(arr.join(""));
        form.render('select'); //刷新select选择框渲染
    }
})

//完成筛选
$('#search').on('submit', function(e) {
    e.preventDefault();
    let state = $('select[name=state]').val();
    let cate_id = $('select[name=category]').val();
    if (state) {
        data.state = state;

    } else {
        delete data.state;
    }
    if (cate_id) {
        data.cate_id = cate_id;
    } else {
        delete data.cate_id;
    }
    renderArticle();


})

//删除文章
$('body').on('click', 'button:contains("删除")', function() {
    //获取删除按钮id
    let id = $(this).data('id');
    layer.confirm('你确定删除吗？', function(index) {
        $.ajax({
            url: '/my/article/delete/' + id,
            success: function(res) {
                // console.log(res);
                layer.msg(res.message);
                if (res.status === 0) {
                    renderArticle();
                }
            }

        });
        layer.close(index); // 关闭弹层
    })
})